import React from 'react';
import ImageLazy from '../commons/ImageLazy';
import NavLink from '../commons/NavLink';
import { connect } from 'react-redux';
import {them_hos_data} from '../../actions';
import {getHosImg} from '../../actions/ActionTypes';

const mall_vip = require('!url?limit=8192&name=static/img/[hash:6].[ext]!../../static/img/mall_vip.png');
const mall_star = require('!url?limit=8192&name=static/img/[hash:6].[ext]!../../static/img/mall_star.png');
const mall_doc = require('!url?limit=8192&name=static/img/[hash:6].[ext]!../../static/img/mall_doc.png');

let M_t_hos =React.createClass({
  componentDidMount:function(){
    const {dispatch} = this.props;
    dispatch(them_hos_data(20,1))
  },
  render:function(){
    const {data_list} = this.props || [];
    let to_data_list = data_list || [];
    return(
      <div id="mall_view">
      <div className="mall_them_doc mall_them_hos">
        <div className="item_wrapper">
          {
            to_data_list.map(function(item,index){
              let img_src = getHosImg(item.hospitalSmallLogo,'_200_200',item.hospitalId);
              let bgStyle={
                'backgroundImage':'url('+ img_src + ')'
              }
              return(
                <NavLink key={index} to={"/hos/det/"+item.hospitalId} className="common_item border_b1">
                  <div className="left">
                    <em style={bgStyle}></em>
                  </div>
                  <div className="right">
                    <h4>{item.hospitalName}<ImageLazy src={mall_vip} /></h4>
                    <p>
                      资质：{item.hospitalClass=="1"?"公立":"民营"}<br/>
                      地址：{item.hospitalAddress}
                    </p>
                    <div className="total">
                      <em><ImageLazy src={mall_doc} />医生{item.doctorNum}人</em>
                      <em><ImageLazy src={mall_star} />{item.caseNum}案例</em>
                    </div>
                  </div>
                </NavLink>
              )
            })
          }
        </div>
      </div>
      </div>
    )
  }
})

let mapStateToProps = (state)=>{
  let {data} = state.mall.mall_them_hos || [];
  let {list} = data || [];
  return{
    data_list:list
  }
}

export default connect(mapStateToProps)(M_t_hos);
